/**
 * Sample React Native App
 * https://github.com/facebook/react-native
 * @flow
 */

import React, { Component } from 'react';
import {
  Platform,
  StyleSheet,
  Text,
  View,
  ScrollView,
  Image
} from 'react-native';

export default class MineScreen extends Component {
  
  render() {

    return (
      <ScrollView>
      <View style={styles.container}>
          <View style={styles.lineContainer}>
            <Image source={require('../../image/icon_chat_photo.png')} 
             style={{height:56,width:56,alignSelf:'center',marginLeft:15}}/>
            <View style={{position:'relative',flex:1}}>
                  <View style={{flexDirection:'row',alignItems:'center',marginTop:12}}>
                  <Text style={[styles.text,{marginLeft:8,marginTop:4}]}>小明</Text> 
                  <Image style={{marginLeft:8,height:11,width:11}} 
                   source={require('../../image/combined_shape.png')}></Image> 
                  <Text style={{fontSize:12,color:'#c4c6cc',marginLeft:4}}>未认证</Text>
                  </View>
                  <Text style={[styles.subText,{position:'absolute',left:8,bottom:16}]}>13512345679</Text> 
            </View>
            <Image source={require('../../image/widget/icon_message_right.png')} 
            style={{marginRight:15,alignSelf:'center'}}/>
          </View>

          <View style={styles.lineSpace}></View>

          <View style={styles.lineContainer1}>
              <Image source={require('../../image/my/icon_mine_1.png')}/>
              <Text style={styles.text1}>我的记账本</Text>
              <Image source={require('../../image/widget/icon_message_right.png')} 
              style={{marginRight:15}}/>
          </View>

          <View style={styles.line}></View>

          <View style={styles.lineContainer1}>
              <Image source={require('../../image/my/icon_mine_2.png')}/>
              <Text style={styles.text1}>我的银行卡</Text>
              <Image source={require('../../image/widget/icon_message_right.png')} 
              style={{marginRight:15}}/>
          </View>

          <View style={styles.line}></View>

          <View style={styles.lineContainer1} >
              <Image source={require('../../image/my/icon_mine_3.png')}/>
              <Text style={styles.text1}>我的二维码</Text>
              <Image source={require('../../image/widget/icon_message_right.png')} 
              style={{marginRight:15}}/>
          </View>

          <View style={styles.lineSpace}></View>

          <View style={styles.lineContainer1}>
              <Image source={require('../../image/my/icon_mine_4.png')}/>
              <Text style={styles.text1}>实名认证</Text>
              <Image source={require('../../image/widget/icon_message_right.png')} 
              style={{marginRight:15}}/>
          </View>

          <View style={styles.line}></View>

          <View style={styles.lineContainer1} >
              <Image source={require('../../image/my/icon_mine_5.png')}/>
              <Text style={styles.text1}>人脸图像</Text>
              <Image source={require('../../image/widget/icon_message_right.png')} 
              style={{marginRight:15}}/>
          </View>

          <View style={styles.lineSpace}></View>

          <View style={styles.lineContainer1}>
              <Image source={require('../../image/my/icon_mine_6.png')}/>
              <Text style={styles.text1}>邀请朋友</Text>
              <Image source={require('../../image/widget/icon_message_right.png')} 
              style={{marginRight:15}}/>
          </View>

          <View style={styles.line}></View>

          <View style={styles.lineContainer1}>
              <Image source={require('../../image/my/icon_mine_7.png')}/>
              <Text style={styles.text1}>帮助中心</Text>
              <Image source={require('../../image/widget/icon_message_right.png')} 
              style={{marginRight:15}}/>
          </View>

          <View style={styles.line}></View>

          <View style={styles.lineContainer1} >
              <Image source={require('../../image/my/icon_mine_8.png')}/>
              <Text style={styles.text1}>意见反馈</Text>
              <Image source={require('../../image/widget/icon_message_right.png')} 
              style={{marginRight:15}}/>
          </View>

          <View style={styles.lineSpace}></View>

          <View style={styles.lineContainer1} >
              <Image source={require('../../image/my/icon_mine_9.png')}/>
              <Text style={styles.text1}>设置</Text>
              <Image source={require('../../image/widget/icon_message_right.png')} 
              style={{marginRight:15}}/>
          </View>

      </View>
      </ScrollView>
    );
  }
}

const styles = StyleSheet.create({
  container: {
    flex: 1, 
    backgroundColor: '#ffffff',
  },
  lineContainer:{
    flexDirection:'row',
    paddingTop:7,
    paddingBottom:7,
    height:80,
  },
  lineContainer1:{
    flexDirection:'row',
    paddingTop:7,
    paddingBottom:7,
    paddingLeft:15,
    height:48,
    alignItems:'center'
  },
  text: {
    color: '#000000',
    fontSize: 16,
    fontWeight: 'bold'
  },
  subText:{
    color: '#8d9199',
    fontSize: 14,
    fontWeight: 'bold'
  },
  line:{
    height:1,
    backgroundColor:'#e1e2e6',
    marginLeft:40
  },
  lineSpace:{
    height:10,
    backgroundColor:'#f2f3f5'
  },
  text1:{
    color: '#000000',
    fontSize: 16,
    fontWeight: 'bold',
    flex:1
  }
});
